import React, { Component } from 'react';
import "../assets/css/MenuProductItem.css";
import { withRouter } from "react-router-dom"

class MenuProductItem extends Component {
    constructor(props) {
        super(props)
    
        this.state = {
             
        }
        this.ToDetail = this.ToDetail.bind(this)
    }
    
    ToDetail(){
        this.props.history.push("/commodityDetail/" + this.props.item.pid)
    }
    render() {
        return (
            <li className="MenuProductItem" onClick={this.ToDetail}>
                <img src={this.props.item.smallImg} alt=""/>
                <p className="MenuProductItem_name">{this.props.item.name}</p>
                <p className="MenuProductItem_enname">{this.props.item.enname}</p>
                <p className="MenuProductItem_price">￥{this.props.item.price}</p>
            </li>
        );
    }
}

export default withRouter(MenuProductItem);